/* الوضع الداكن العام */
html.dark-mode-active, body.dark-mode-active {
    background-color: #2e2e2e !important; /* رمادي داكن رسمي */
    color: #f5f5f5 !important;
}

/* القوائم (navbars) بلون نفس الخلفية */
html.dark-mode-active nav,
html.dark-mode-active .navbar,
html.dark-mode-active #main-nav {
    background-color: #2e2e2e !important; /* نفس لون الخلفية الرسمية */
    color: #ffffff !important;
}

/* الروابط داخل القوائم */
html.dark-mode-active nav a,
html.dark-mode-active .navbar a,
html.dark-mode-active #main-nav a {
    color: #ffffff !important;
}

/* الروابط عند المرور عليها */
html.dark-mode-active nav a:hover,
html.dark-mode-active .navbar a:hover,
html.dark-mode-active #main-nav a:hover {
    color: #99ccee !important; /* أزرق رسمي هادئ */
}

/* العنصر النشط في القائمة */
html.dark-mode-active nav .current-menu-item > a,
html.dark-mode-active .navbar .current-menu-item > a,
html.dark-mode-active #main-nav .current-menu-item > a {
    color: #99ccee !important;
    font-weight: bold;
}

/* الخلفيات الشائعة */
html.dark-mode-active div,
html.dark-mode-active section,
html.dark-mode-active main,
html.dark-mode-active article,
html.dark-mode-active aside {
    background-color: #3a3a3a !important;
    color: #f0f0f0 !important;
}

/* الروابط العامة */
html.dark-mode-active a {
    color: #99ccee !important;
}

/* رأس وتذييل */
html.dark-mode-active .header,
html.dark-mode-active .footer,
html.dark-mode-active .navbar {
    background-color: #2b2b2b !important;
    color: #f0f0f0 !important;
}

/* الحقول */
html.dark-mode-active input,
html.dark-mode-active textarea,
html.dark-mode-active select {
    background-color: #4a4a4a !important;
    color: #ffffff !important;
    border: 1px solid #888 !important;
}

/* الأزرار */
html.dark-mode-active button {
    background-color: #5a5a5a !important;
    color: #ffffff !important;
    border: 1px solid #aaa !important;
}

/* زر الوضع الليلي */
html.dark-mode-active .dark-mode {
    color: #ffffff !important;
    background-color: transparent !important;
    border: none !important;
}

/* تجاوز الخلفيات من القالب */
html.dark-mode-active .bg-white-column,
html.dark-mode-active .bg-light-grey,
html.dark-mode-active .bg-light-snow,
html.dark-mode-active .bg-f7f,
html.dark-mode-active .bg-ffc,
html.dark-mode-active .widget,
html.dark-mode-active #site-header,
html.dark-mode-active #top-bar,
html.dark-mode-active #main-nav-mobi,
html.dark-mode-active .header-search-field,
html.dark-mode-active .comment-list.style-2 li,
html.dark-mode-active .comment-list.style-22 li,
html.dark-mode-active .hentry,
html.dark-mode-active .post-link a {
    background-color: #3b3b3b !important;
    color: #ffffff !important;
    border-color: #555 !important;
}

/* النصوص */
html.dark-mode-active,
html.dark-mode-active p,
html.dark-mode-active span,
html.dark-mode-active h1,
html.dark-mode-active h2,
html.dark-mode-active h3,
html.dark-mode-active h4,
html.dark-mode-active h5,
html.dark-mode-active h6,
html.dark-mode-active .widget-title,
html.dark-mode-active a {
    color: #f2f2f2 !important;
}

/* القوائم المنسدلة */
html.dark-mode-active #main-nav .sub-menu,
html.dark-mode-active #main-nav .sub-menu li,
html.dark-mode-active #main-nav .sub-menu li a {
    background-color: #e2e2e2 !important;
    color: #111111 !important;
}

html.dark-mode-active #main-nav .sub-menu li a:hover {
    background-color: #cccccc !important;
    color: #000000 !important;
}

/* الفوتر */
html.dark-mode-active .footer-box,
html.dark-mode-active .footer-middle,
html.dark-mode-active .footer-widget,
html.dark-mode-active .footer-inner,
html.dark-mode-active .custom-footer-container {
    background-color: #2f2f2f !important;
    color: #f2f2f2 !important;
    border: none !important;
    box-shadow: none !important;
}

html.dark-mode-active #footer {
    background-color: #252525 !important;
    color: #f2f2f2 !important;
}

html.dark-mode-active #ayman {
    background-color: #252525 !important;
    color: #f2f2f2 !important;
}

html.dark-mode-active .aayman {
    background-color: #252525 !important;
    color: #f2f2f2 !important;
}

html.dark-mode-active .clearfix.has-spacer {
    background-color: #1e1e1e !important;
    color: #d0d0d0 !important;
}

html.dark-mode-active #inner-sidebar {
    background-color: #252525 !important;
    color: #ffffff !important;
}

html.dark-mode-active .text-over-image,
html.dark-mode-active .image-caption {
    color: #ffffff !important;
    text-shadow: 1px 1px 2px rgba(0,0,0,0.7);
}

/* النقاط (Dot Indicators) */

/* لإخفاء أي حدود أو مربعات للأزرار */
html.dark-mode-active .slick-dots li button,
html.dark-mode-active .carousel-indicators li {
    border: none !important;
    background: transparent !important;
    padding: 0 !important;
    margin: 0 4px !important; /* مسافة صغيرة بين النقاط */
}

/* إزالة أي محتوى افتراضي */
html.dark-mode-active .slick-dots li button {
    font-size: 0 !important;
    line-height: 0 !important;
}

/* اجعل before هو الدائرة الوحيدة */
html.dark-mode-active .slick-dots li button:before {
    content: '' !important;
    display: inline-block !important;
    width: 10px !important;
    height: 10px !important;
    border-radius: 50% !important;
    background-color: #cccccc !important;
    opacity: 1 !important;
}

/* النقطة النشطة */
html.dark-mode-active .slick-dots li.slick-active button:before {
    background-color: #ffffff !important;
}

/* نفس الفكرة للـ bootstrap carousel indicators */
html.dark-mode-active .carousel-indicators li {
    width: 10px !important;
    height: 10px !important;
    border-radius: 50% !important;
    background-color: #cccccc !important;
}

html.dark-mode-active .carousel-indicators .active {
    background-color: #ffffff !important;
}


/* لون الخط للعناصر الرئيسية فقط */
html.dark-mode-active nav.main-nav > ul.menu > li.menu-item > a {
    color: white !important;
}

/* توحيد لون شريط السياسات في أسفل الفوتر */
html.dark-mode-active .alast,
html.dark-mode-active .alast a {
    background-color: #1f1f1f !important; /* لون مختلف عن الخلفية العامة */
    color: #ffffff !important;           /* نص أبيض واضح */
}

/* إزالة الحواف أو الفواصل بين المربعات */
html.dark-mode-active .alast > div {
    border: none !important;
    background-color: transparent !important;
}

html.dark-mode-active .title {
  background-color: #f8f8f8 !important;
  color: #1c1c1c !important; /* لون نص واضح */
}

html.dark-mode-active .cbq-layout-main > div{
	background-color: #1f1f1f !important; /* لون مختلف عن الخلفية العامة */
    color: #ffffff !important; 
}

html.dark-mode-active #scroll-top:after {
   background-color: #1f1f1f !important; /* لون مختلف عن الخلفية العامة */
    color: #ffffff !important; 
}

html.dark-mode-active #WebPartWPQ3  > div{
	background-color: #1f1f1f !important; /* لون مختلف عن الخلفية العامة */
    color: #ffffff !important; 
}

/* الخلفية الرصاصية الفاتحة للمستطيل */
html.dark-mode-active .ms-core-listMenu-root {
  background-color: #dcdcdc; /* رمادي فاتح */
  padding: 1rem;
}

/* الروابط داخل القائمة */
html.dark-mode-active .ms-core-listMenu-root a {
  color: #1a1a1a !important; /* لون غامق للنص */
  text-decoration: none;
  display: block;
  padding: 10px 0;
}

/* نص العنصر داخل الرابط */
html.dark-mode-active .ms-core-listMenu-root .menu-item-text {
  color: #1a1a1a !important;
}

/* عند التمرير */
html.dark-mode-active .ms-core-listMenu-root a:hover {
  color: #000 !important;
  background-color: #c0c0c0; /* رمادي أغمق عند التمرير */
}

/* إزالة الخلفيات الزائدة */
html.dark-mode-active .ms-core-listMenu-rootu .additional-background {
  background: transparent !important;
}

html.dark-mode-active .aha {
  background-color: #dcdcdc !important; /* لون خلفية المستطيل الفاتح */
 color: #dcdcdc !important; /* لون النص الغامق */
}

html.dark-mode-active nav.main-nav > ul.menu > li.menu-item {
    background-color: #252525 !important;
}

html.dark-mode-active .breadcrumb a {
    color: white !important;
}



html.dark-mode-active .value-list li {
    color: #cccccc !important; /* رمادي فاتح */
}

html.dark-mode-active ul.reset {
    background-color: #3a3a3a !important;
}

html.dark-mode-active p strong {
    color: white !important;
}

/* html.dark-mode-active  */
/* .ms-webpart-zone, */
/* html.dark-mode-active  */
/* .ms-webpartzone-cell, */
/* html.dark-mode-active  */
/* .ms-webpart-chrome, */
/* html.dark-mode-active  */
/* .ms-WPBody, */
html.dark-mode-active 
#divSearch {
    background-color: #d9d9d9 !important;
}

/* استهداف المناطق الرئيسية */
html.dark-mode-active #divTitle,
html.dark-mode-active #divCriteria,
html.dark-mode-active #divSubmit {
    background-color: #d9d9d9 !important;
    padding: 10px;
    color: black !important; /* لون النصوص أسود */
}

/* جميع العناصر داخلها (div, span, label ...) */
html.dark-mode-active #divTitle *,
html.dark-mode-active #divCriteria *,
html.dark-mode-active #divSubmit * {
    background-color: #d9d9d9 !important;
    color: black !important; /* لون النصوص أسود */
}

/* استثناء الحقول والأزرار من تغيير الخلفية والنص */
html.dark-mode-active #divCriteria select,
html.dark-mode-active #divCriteria input,
html.dark-mode-active #divSubmit input,
html.dark-mode-active #divCriteria option {
    background-color: white !important;
    color: black !important;
}

html.dark-mode-active .ms-webpart-zone,
html.dark-mode-active .ms-webpartzone-cell,
html.dark-mode-active .ms-WPBody,
html.dark-mode-active .cbq-layout-main,
html.dark-mode-active .newslistcat span {
    background-color: #3a3a3a !important;
}

 
html.dark-mode-active .video_item,
html.dark-mode-active .title {
  background-color: #3a3a3a !important;
  color: white !important;
}


html.dark-mode-active #cbqwpctl00_ctl66_g_d2bcf10e_c4b0_4a9e_962f_d227a23c928b > div {
  background-color: #3a3a3a !important;
}

/*html.dark-mode-active #divTitle {
  background-color: #3a3a3a !important;
}*/

/*html.dark-mode-active #divTitle span {
  background-color: #3a3a3a !important;
  color: white !important;
}*/

html.dark-mode-active #ctl00_ctl66_g_01face9a_04c8_44c2_a811_87271ab57ff7 > div {
  background-color: #3a3a3a !important;
}
html.dark-mode-active #ctl00_ctl66_g_01face9a_04c8_44c2_a811_87271ab57ff7 > div > span {
  background-color: #3a3a3a !important;
   color: white !important;
}

html.dark-mode-active .item-title {
  background-color: #3a3a3a !important;
  color: white !important;
}

html.dark-mode-active .ms-gb {
  background-color: #3a3a3a !important;
  color: white !important;
}

html.dark-mode-active #inner-sidebar {
  background-color: #3a3a3a !important;
}

html.dark-mode-active .overlay-effect {
  background-color: rgba(255, 255, 255, 0.05) !important; /* خلفية شبه شفافة */
    /* أو لجعلها شفافة بالكامل */
    /* background-color: transparent; */
}
html.dark-mode-active .elm-link {
  background-color: rgba(255, 255, 255, 0.05) !important; /* خلفية شبه شفافة */
    /* أو لجعلها شفافة بالكامل */
    /* background-color: transparent; */
}

html.dark-mode-active .video-overlay {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    background: rgba(0, 0, 0, 0.6) !important; /* اللون الافتراضي: أسود شفاف */
    transition: background 0.3s ease !important; /* لتأثير انسيابي */
}

html.dark-mode-active .video-overlay:hover {
    background: rgba(0, 0, 0, 0.6) !important; /* شفاف فاتح عند المرور */
}


/* تغيير الصور في شريط السفلي عند الوضع الداكن */
html.dark-mode-active .information-egovermen-dark {
  content: url("/English/HomePictures/dark-mode/Information & eGovernment Authority.png") !important;
}

html.dark-mode-active .civil-service-dark {
  content: url("/English/HomePictures/dark-mode/Colored_Civil Service Bureau.png") !important;
}

html.dark-mode-active .tender-board-dark {
  content: url("/English/HomePictures/dark-mode/Tender Board.png") !important;
}

html.dark-mode-active .ministry-municipalities-agriculture-dark {
  content: url("/English/HomePictures/dark-mode/وزارة شؤون البلديات والزراعة_أساسي ملون.png") !important;
}

html.dark-mode-active .ministry-housing-dark {
  content: url("/English/HomePictures/dark-mode/وزارة الإسكان والتخطيط العمراني_أساسي.png") !important;
}

html.dark-mode-active .urban-planing-development-dark {
  content: url("/English/HomePictures/dark-mode/Urban Planning and Development Authority.png") !important;
}








/*html.dark-mode-active .backgroundcolor {
  background-color: #00FF00 !important;
}




/*html.dark-mode-active .widget.widget_helpalign-center.has-shadow.no-sep.as-border.border-solid {
  background-color: #00FF00 !important;
}

html.dark-mode-active .ms-webpart-zone.ms-fullWidth {
  background-color: #00FF00 !important;
}
/* html.dark-mode-active .ms-rtestate-field > div {
  background-color: #d9d9d9 !important;
}

/* عند تفعيل الوضع الداكن */
/* html.dark-mode-active .ms-rtestate-field {
  background-color: #d9d9d9 !important;
}

/* إذا كانت هناك DIVs داخلية فيها لون أبيض من القالب */
/*html.dark-mode-active .ms-rtestate-field {
  background-color: #d9d9d9 !important;
}